<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/warpper.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/slider.css">
    <script src="./lib/jquery.js"></script>
    <script src="./lib/slider.js"></script>
    <script src="./js/index.js"></script>
</head>
<body>
    <div id="ceb">
        <ul>
            <li class="fbg01">
                <a href="">图片</a>
            </li>
            <li class="fbg02">
                <a href="">服装</a>
            </li>
            <li class="fbg03">
                <a href="">运动</a>
            </li>
            <li class="fbg04">
                <a href="">童鞋</a>
            </li>
            <li class="fbg05">
                <a href="">家居</a>
            </li>
        </ul>
    </div>
    <!-- 顶部区域开始 -->
    <div class="top1">
        <div class="warpper clearfix">
            <p class="fl">legochina.cn</p>
            <span class="fr">
                欢迎光临
                <a href="#">乐购</a>,
                请 登陆\
                <a href="#">注册</a>
            </span>
        </div>
    </div>
    <!-- 顶部区域结束 -->

    <!-- 头部区域开始 -->
    <div class="header warpper clearfix">
        <div class="fl">
            <img src="./imgs/logo.jpg" alt="">
        </div>
        <div class="fr">
            <form action="#" class="search clearfix">
                    <input type="text" placeholder="拖鞋啊" >
                    <input type="button" class="input2">
                <a href="" class="_a1 fl">
                    <span></span>
                    购物车&nbsp;3
                </a>
                <a href="" class="_a2 fl">我的订单</a>
            </form>
            
        </div>
        <ul class="fr clearfix">
            <li>图书</li>
            <li>电子书</li>
            <li>原创文学</li>
            <li>服装</li>
            <li>运动户外</li>
            <li>孕婴童</li>
            <li>家居</li>
            <li>创意文具</li>
            <li>地方特产</li>
            <li>海外购</li>
            <li>电器城</li>
        </ul>
    </div>
    <!-- 头部区域结束 -->

    <!-- 海报区域开始 -->
    <div class="banner warpper clearfix">
        <!-- 左边 -->
        <ul class="category fl">
            <!-- <li>
                <p>图书、电子书、童书</p>
                <div>box1</div>
            </li> -->
            <script>
                let arr_p=[
                    "图书、电子书、童书",
                    "创意文具",
                    "服饰、内衣",
                    "鞋靴、箱包",
                    "运动户外",
                    "孕、婴、童",
                    "家居、家纺、汽车",
                    "家具、家装、康体",
                    "美妆、个人护理、成人",
                    "食品、茶酒、生鲜",
                    "腕表、珠宝、眼镜",
                    "手机、数码",
                    "电脑办公",
                    "家用电器"
                ]
                let arr_div=[
                    "box1",
                    "box2",
                    "box3",
                    "box4",
                    "box5",
                    "box6",
                    "box7",
                    "box8",
                    "box9",
                    "box10",
                    "box11",
                    "box12",
                    "box13",
                    "box14"
                ]
                for(let i=0;i<14;i++){
                    document.write(
                        `<li>
                    <p>${arr_p[i]}</p>
                    <div>${arr_div[i]}</div>
                    </li> `
                    )
                }
            </script>
            
        </ul>

        <!-- 轮播图开始 -->
        <div class="pptbox" id="bannerInner">
            <!--轮播的内容-->
            <ul class="innerwrapper">
            <li>
                <img src="imgs/banner1.jpg" />
            </li>
            <li>
                <a href="#"></a><img src="imgs/banner2.jpg" /></a>
            </li>
            <li>
                <a href="#"><img src="imgs/banner3.jpg" /></a>
            </li>
            <li>
                <a href="#"><img src="imgs/banner4.jpg" /></a>
            </li>
            <li>
                <a href="#"><img src="imgs/banner5.jpg" /></a>
            </li>
            <li>
                <a href="#"><img src="imgs/banner2.jpg"></a>
            </li>
            </ul>
            <!--数字控制器-->
            <ul class="controls">
            <li class="current">1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            </ul>
            <!--按钮控制器-->
            <span class="btnleft"></span>
            <span class="btnright"></span>
        </div>
        <!-- 轮播图结束 -->
    </div>
    <!-- 海报区域结束 -->

    <!-- 今日推荐区域开始 -->
    <div class="aboutus warpper">
        <h2>乐购&nbsp;·&nbsp;今日推荐</h2>
        <ul class="clearfix">
            <li>
                <img src="./imgs/re-demo.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>黑爵青蜂侠六键电竞游戏鼠标</p>
                <p style="color: #f4290d;">全国联保 一年免费包换</p>
                <span>￥:299</span>
            </li>
            <li>
                <img src="./imgs/re-demo.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>黑爵青蜂侠六键电竞游戏鼠标</p>
                <p style="color: #f4290d;">全国联保 一年免费包换</p>
                <span>￥:299</span>
            </li>
            <li>
                <img src="./imgs/re-demo.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>黑爵青蜂侠六键电竞游戏鼠标</p>
                <p style="color: #f4290d;">全国联保 一年免费包换</p>
                <span>￥:299</span>
            </li>
            <li>
                <img src="./imgs/re-demo.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>黑爵青蜂侠六键电竞游戏鼠标</p>
                <p style="color: #f4290d;">全国联保 一年免费包换</p>
                <span>￥:299</span>
            </li>
            <li>
                <img src="./imgs/re-demo.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>黑爵青蜂侠六键电竞游戏鼠标</p>
                <p style="color: #f4290d;">全国联保 一年免费包换</p>
                <span>￥:299</span>
            </li>
            <li>
                <img src="./imgs/re-demo.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>黑爵青蜂侠六键电竞游戏鼠标</p>
                <p style="color: #f4290d;">全国联保 一年免费包换</p>
                <span>￥:299</span>
            </li>
            <li>
                <img src="./imgs/index06_11.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>小熊家用静音加湿器</p>
                <p style="color: #f4290d;">唯美外观 微米级喷雾</p>
                <span>￥:89</span>
            </li>
            <li>
                <img src="./imgs/index06_11.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>小熊家用静音加湿器</p>
                <p style="color: #f4290d;">唯美外观 微米级喷雾</p>
                <span>￥:89</span>
            </li>
            <li>
                <img src="./imgs/index06_11.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>小熊家用静音加湿器</p>
                <p style="color: #f4290d;">唯美外观 微米级喷雾</p>
                <span>￥:89</span>
            </li>
            <li>
                <img src="./imgs/index06_11.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>小熊家用静音加湿器</p>
                <p style="color: #f4290d;">唯美外观 微米级喷雾</p>
                <span>￥:89</span>
            </li>
            <li>
                <img src="./imgs/index06_11.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>小熊家用静音加湿器</p>
                <p style="color: #f4290d;">唯美外观 微米级喷雾</p>
                <span>￥:89</span>
            </li>
            <li>
                <img src="./imgs/index06_11.jpg" alt="" class="img1">
                <img src="./imgs/limitTime.jpg" alt="">
                <p>小熊家用静音加湿器</p>
                <p style="color: #f4290d;">唯美外观 微米级喷雾</p>
                <span>￥:89</span>
            </li>
        </ul>
    </div>
    <!-- 今日推荐区域结束 -->

    <!-- 电子书区域开始 -->
    <div class="ebooks warpper clearfix fooer">
        <div class="ebooks_left clearfix fl">
            <!-- 头部 -->
            <h3 class="clearfix">图书 &nbsp;&nbsp;电子书
               <ul class="clearfix fr">
                   <li class="active">新书上架</li>
                   <li>旧书上架</li>
                   <li>老鼠上架</li>
               </ul>
            </h3>
            <div class="clearfix">
                <!-- 左边 -->
                <div class="fl">
                <img src="./imgs/index7_07.jpg" alt="">
                <table>
                    <tr>
                        <td>中小学教辅</td>
                        <td>外语</td>
                        <td>考试</td>
                    </tr>
                    <tr>
                        <td>小说</td>
                        <td>文学</td>
                        <td>青春文学</td>
                    </tr>
                    <tr>
                        <td>成功\励志</td>
                        <td>管理</td>
                        <td>历史</td>
                    </tr>
                    <tr>
                        <td>哲学\宗教</td>
                        <td>亲子\家教</td>
                        <td>全部分类></td>
                    </tr>
                </table>
                </div>
                <!-- 右边 -->
                <div class="ebooks_left_right1 fl">
                    <ul class="ebooks_left_right fl clearfix show">
                        <li>
                            <div class="pptbox" id="ebooks_slider">
                                <!--轮播的内容-->
                                <ul class="innerwrapper">
                                <li>
                                    <img src="imgs/banner1.jpg" />
                                </li>
                                <li>
                                    <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                                </li>
                                <li>
                                    <a href="#"><img src="imgs/banner3.jpg" /></a>
                                </li>
                                <li>
                                    <a href="#"><img src="imgs/banner4.jpg" /></a>
                                </li>
                                
                                </ul>
                                <!--数字控制器-->
                                <ul class="controls">
                                <li class="current">1</li>
                                <li>2</li>
                                <li>3</li>
                                <li>4</li>
                                </ul>
                                <!--按钮控制器-->
                                <span class="btnleft"></span>
                                <span class="btnright"></span>
                            </div>
                            
                        </li>
                        
                        <script>
                            for(let i=0;i<6;i++){
                                document.write(`
                                    <li>
                                        <p>奥运狂欢</p>
                                        <p class="ebooks_p">十万种电子书&nbsp;直降40%</p>
                                        <div>
                                            <img src="./imgs/index09_05.jpg" alt="">
                                        </div>
                                        <span class="s1">￥49</span>
                                        <span class="s2">￥79</span>
                                    </li>
                                `)
                            }
                        </script>
                    </ul>
                    <ul class="ebooks_left_right fl clearfix">
                        <li>
                            <div class="pptbox" id="ebooks_slider">
                                <!--轮播的内容-->
                                <ul class="innerwrapper">
                                <li>
                                    <img src="imgs/banner1.jpg" />
                                </li>
                                <li>
                                    <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                                </li>
                                <li>
                                    <a href="#"><img src="imgs/banner3.jpg" /></a>
                                </li>
                                <li>
                                    <a href="#"><img src="imgs/banner4.jpg" /></a>
                                </li>
                                
                                </ul>
                                <!--数字控制器-->
                                <ul class="controls">
                                <li class="current">1</li>
                                <li>2</li>
                                <li>3</li>
                                <li>4</li>
                                </ul>
                                <!--按钮控制器-->
                                <span class="btnleft"></span>
                                <span class="btnright"></span>
                            </div>
                            
                        </li>
                        
                        <script>
                            for(let i=0;i<6;i++){
                                document.write(`
                                    <li>
                                        <p>哈哈哈哈</p>
                                        <p class="ebooks_p">十万种电子书&nbsp;直降40%</p>
                                        <div>
                                            <img src="./imgs/index09_05.jpg" alt="">
                                        </div>
                                        <span class="s1">￥49</span>
                                        <span class="s2">￥79</span>
                                    </li>
                                `)
                            }
                        </script>
                    </ul>
                    <ul class="ebooks_left_right fl clearfix">
                        <li>
                            <div class="pptbox" id="ebooks_slider">
                                <!--轮播的内容-->
                                <ul class="innerwrapper">
                                <li>
                                    <img src="imgs/banner1.jpg" />
                                </li>
                                <li>
                                    <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                                </li>
                                <li>
                                    <a href="#"><img src="imgs/banner3.jpg" /></a>
                                </li>
                                <li>
                                    <a href="#"><img src="imgs/banner4.jpg" /></a>
                                </li>
                                
                                </ul>
                                <!--数字控制器-->
                                <ul class="controls">
                                <li class="current">1</li>
                                <li>2</li>
                                <li>3</li>
                                <li>4</li>
                                </ul>
                                <!--按钮控制器-->
                                <span class="btnleft"></span>
                                <span class="btnright"></span>
                            </div>
                            
                        </li>
                        
                        <script>
                            for(let i=0;i<6;i++){
                                document.write(`
                                    <li>
                                        <p>啦啦啦啦</p>
                                        <p class="ebooks_p">十万种电子书&nbsp;直降40%</p>
                                        <div>
                                            <img src="./imgs/index09_05.jpg" alt="">
                                        </div>
                                        <span class="s1">￥49</span>
                                        <span class="s2">￥79</span>
                                    </li>
                                `)
                            }
                        </script>
                    </ul>
                </div>
            </div>
                
        </div>

        <div class="ebooks_right fr">
            <h4>新书畅销榜</h4>
            <ul>
                <li>
                    <span>1</span>
                    <h5 class="title_hide">就喜欢你看不惯我  又干不</h5>
                    <div class="ebooks_show clearfix">
                        <img src="./imgs/index08_05.jpg" alt="" class="fl">
                        <div class="ebooks_txt fr"> 
                            <p>
                                从你的世界路过
                            </p>
                            <p>
                                入选央视“2014中国好书”的80后作品！十年华语畅销小说，王家卫陈国富倾力推荐， 1500万次转发，超4亿次阅读
                            </p>
                        </div>
                    </div>
                </li>
                <script>
                    for(let i=1;i<7;i++){
                        document.write(`
                        <li>
                            <span>${i+1}</span>
                            <h5>就喜欢你看不惯我  又干不</h5>
                            <div class="clearfix">
                                <img src="./imgs/index08_05.jpg" alt="" class="fl">
                                <div class="ebooks_txt fl"> 
                                    <p>
                                        从你的世界路过
                                    </p>
                                    <p>
                                        入选央视“2014中国好书”的80后作品！十年华语畅销小说，王家卫陈国富倾力推荐， 1500万次转发，超4亿次阅读
                                    </p>
                                </div>
                            </div>
                        </li>
                        `)
                    }
                </script>
            </ul>
        </div>
    </div>
    <!-- 电子书区域结束 -->

    <!-- 服装区域开始 -->
    <div class="clothing clearfix warpper fooer">
            <h3 class="fl">服装
                <div class="fr clearfix">
                    <span class="active">女装内衣</span>
                    <span>热销男装</span>
                    <span>精品鞋靴</span>
                </div>
            </h3>
            <div class="clothing_ clothing_show clearfix fl">
                <!-- 左边部分 -->
                <div class="clothing_left fl">
                    <img src="./imgs/index7_17.jpg" alt="">
                    <table>
                        <tr>
                            <td>中小学教辅</td>
                            <td>外语</td>
                            <td>考试</td>
                        </tr>
                        <tr>
                            <td>小说</td>
                            <td>文学</td>
                            <td>青春文学</td>
                        </tr>
                        <tr>
                            <td>成功\励志</td>
                            <td>管理</td>
                            <td>历史</td>
                        </tr>
                        <tr>
                            <td>哲学\宗教</td>
                            <td>亲子\家教</td>
                            <td>全部分类></td>
                        </tr>
                    </table>
                </div>
                <!-- 中间部分 -->
                <div class="clothing_mid fl">
                        <!-- 右边轮播图开始 -->
                        <div class="pptbox" id="clothing_mid_left">
                            <!--轮播的内容-->
                            <ul class="innerwrapper">
                            <li>
                                <img src="imgs/banner1.jpg" />
                            </li>
                            <li>
                                <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner3.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner4.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner5.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner2.jpg"></a>
                            </li>
                            </ul>
                            <!--数字控制器-->
                            <ul class="controls">
                            <li class="current">1</li>
                            <li>2</li>
                            <li>3</li>
                            <li>4</li>
                            <li>5</li>
                            <li>6</li>
                            </ul>
                            <!--按钮控制器-->
                            <span class="btnleft"></span>
                            <span class="btnright"></span>
                        </div>
                        <!-- 轮播图结束 -->
                    <div><img src="./imgs/index11_08.jpg" alt=""></div>
                </div>
                <!-- 右边 -->
                <div class="clothing_right fl">
                    <ul class="fl clearfix">
                        <li>
                            <img src="./imgs/index100_05.jpg" alt="">
                            <div><img src="./imgs/index100_11.jpg" alt=""></div>
                        </li>
                        <li>
                            <img src="./imgs/index100_05.jpg" alt="">
                            <div><img src="./imgs/index100_11.jpg" alt=""></div>
                        </li>
                        <li>
                            <img src="./imgs/index100_05.jpg" alt="">
                            <div><img src="./imgs/index100_11.jpg" alt=""></div>
                        </li>
                    </ul>
                </div>
                
            </div>
            <div class="clothing_ clearfix fl">
                <!-- 左边部分 -->
                <div class="clothing_left fl">
                    <img src="./imgs/女装内衣/106960016344413_y.jpg" alt="">
                    <table>
                        <tr>
                            <td>中小学教辅</td>
                            <td>外语</td>
                            <td>考试</td>
                        </tr>
                        <tr>
                            <td>小说</td>
                            <td>文学</td>
                            <td>青春文学</td>
                        </tr>
                        <tr>
                            <td>成功\励志</td>
                            <td>管理</td>
                            <td>历史</td>
                        </tr>
                        <tr>
                            <td>哲学\宗教</td>
                            <td>亲子\家教</td>
                            <td>全部分类></td>
                        </tr>
                    </table>
                </div>
                <!-- 中间部分 -->
                <div class="clothing_mid fl">
                        <!-- 右边轮播图开始 -->
                        <div class="pptbox" id="clothing_mid_left">
                            <!--轮播的内容-->
                            <ul class="innerwrapper">
                            <li>
                                <img src="imgs/banner1.jpg" />
                            </li>
                            <li>
                                <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner3.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner4.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner5.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner2.jpg"></a>
                            </li>
                            </ul>
                            <!--数字控制器-->
                            <ul class="controls">
                            <li class="current">1</li>
                            <li>2</li>
                            <li>3</li>
                            <li>4</li>
                            <li>5</li>
                            <li>6</li>
                            </ul>
                            <!--按钮控制器-->
                            <span class="btnleft"></span>
                            <span class="btnright"></span>
                        </div>
                        <!-- 轮播图结束 -->
                    <div><img src="./imgs/index11_08.jpg" alt=""></div>
                </div>
                <!-- 右边 -->
                <div class="clothing_right fl">
                    <ul class="fl clearfix">
                        <li>
                            <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                            <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                        </li>
                        <li>
                            <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                            <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                        </li>
                        <li>
                            <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                            <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                        </li>
                    </ul>
                </div>
                
            </div>
            <div class="clothing_ clearfix fl">
                <!-- 左边部分 -->
                <div class="clothing_left fl">
                    <img src="./imgs/精品鞋靴/52610014590238_1_o.jpg" alt="">
                    <table>
                        <tr>
                            <td>中小学教辅</td>
                            <td>外语</td>
                            <td>考试</td>
                        </tr>
                        <tr>
                            <td>小说</td>
                            <td>文学</td>
                            <td>青春文学</td>
                        </tr>
                        <tr>
                            <td>成功\励志</td>
                            <td>管理</td>
                            <td>历史</td>
                        </tr>
                        <tr>
                            <td>哲学\宗教</td>
                            <td>亲子\家教</td>
                            <td>全部分类></td>
                        </tr>
                    </table>
                </div>
                <!-- 中间部分 -->
                <div class="clothing_mid fl">
                        <!-- 右边轮播图开始 -->
                        <div class="pptbox" id="clothing_mid_left">
                            <!--轮播的内容-->
                            <ul class="innerwrapper">
                            <li>
                                <img src="imgs/banner1.jpg" />
                            </li>
                            <li>
                                <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner3.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner4.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner5.jpg" /></a>
                            </li>
                            <li>
                                <a href="#"><img src="imgs/banner2.jpg"></a>
                            </li>
                            </ul>
                            <!--数字控制器-->
                            <ul class="controls">
                            <li class="current">1</li>
                            <li>2</li>
                            <li>3</li>
                            <li>4</li>
                            <li>5</li>
                            <li>6</li>
                            </ul>
                            <!--按钮控制器-->
                            <span class="btnleft"></span>
                            <span class="btnright"></span>
                        </div>
                        <!-- 轮播图结束 -->
                    <div><img src="./imgs/index11_08.jpg" alt=""></div>
                </div>
                <!-- 右边 -->
                <div class="clothing_right fl">
                    <ul class="fl clearfix">
                        <li>
                            <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                            <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                        </li>
                        <li>
                            <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                            <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                        </li>
                        <li>
                            <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                            <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                        </li>
                    </ul>
                </div>
                
            </div>
    </div>
    <!-- 服装区域结束 -->

    <!-- 运动产品区域开始 -->
    <div class="clothing clearfix warpper fooer">
        <h3 class="fl">服装
            <div class="fr clearfix">
                <span class="active">女装内衣</span>
                <span>热销男装</span>
                <span>精品鞋靴</span>
            </div>
        </h3>
        <div class="clothing_ clothing_show clearfix fl">
            <!-- 左边部分 -->
            <div class="clothing_left fl">
                <img src="./imgs/index7_17.jpg" alt="">
                <table>
                    <tr>
                        <td>中小学教辅</td>
                        <td>外语</td>
                        <td>考试</td>
                    </tr>
                    <tr>
                        <td>小说</td>
                        <td>文学</td>
                        <td>青春文学</td>
                    </tr>
                    <tr>
                        <td>成功\励志</td>
                        <td>管理</td>
                        <td>历史</td>
                    </tr>
                    <tr>
                        <td>哲学\宗教</td>
                        <td>亲子\家教</td>
                        <td>全部分类></td>
                    </tr>
                </table>
            </div>
            <!-- 中间部分 -->
            <div class="clothing_mid fl">
                    <!-- 右边轮播图开始 -->
                    <div class="pptbox" id="clothing_mid_left">
                        <!--轮播的内容-->
                        <ul class="innerwrapper">
                        <li>
                            <img src="imgs/banner1.jpg" />
                        </li>
                        <li>
                            <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner3.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner4.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner5.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner2.jpg"></a>
                        </li>
                        </ul>
                        <!--数字控制器-->
                        <ul class="controls">
                        <li class="current">1</li>
                        <li>2</li>
                        <li>3</li>
                        <li>4</li>
                        <li>5</li>
                        <li>6</li>
                        </ul>
                        <!--按钮控制器-->
                        <span class="btnleft"></span>
                        <span class="btnright"></span>
                    </div>
                    <!-- 轮播图结束 -->
                <div><img src="./imgs/index11_08.jpg" alt=""></div>
            </div>
            <!-- 右边 -->
            <div class="clothing_right fl">
                <ul class="fl clearfix">
                    <li>
                        <img src="./imgs/index100_05.jpg" alt="">
                        <div><img src="./imgs/index100_11.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/index100_05.jpg" alt="">
                        <div><img src="./imgs/index100_11.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/index100_05.jpg" alt="">
                        <div><img src="./imgs/index100_11.jpg" alt=""></div>
                    </li>
                </ul>
            </div>
            
        </div>
        <div class="clothing_ clearfix fl">
            <!-- 左边部分 -->
            <div class="clothing_left fl">
                <img src="./imgs/女装内衣/106960016344413_y.jpg" alt="">
                <table>
                    <tr>
                        <td>中小学教辅</td>
                        <td>外语</td>
                        <td>考试</td>
                    </tr>
                    <tr>
                        <td>小说</td>
                        <td>文学</td>
                        <td>青春文学</td>
                    </tr>
                    <tr>
                        <td>成功\励志</td>
                        <td>管理</td>
                        <td>历史</td>
                    </tr>
                    <tr>
                        <td>哲学\宗教</td>
                        <td>亲子\家教</td>
                        <td>全部分类></td>
                    </tr>
                </table>
            </div>
            <!-- 中间部分 -->
            <div class="clothing_mid fl">
                    <!-- 右边轮播图开始 -->
                    <div class="pptbox" id="clothing_mid_left">
                        <!--轮播的内容-->
                        <ul class="innerwrapper">
                        <li>
                            <img src="imgs/banner1.jpg" />
                        </li>
                        <li>
                            <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner3.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner4.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner5.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner2.jpg"></a>
                        </li>
                        </ul>
                        <!--数字控制器-->
                        <ul class="controls">
                        <li class="current">1</li>
                        <li>2</li>
                        <li>3</li>
                        <li>4</li>
                        <li>5</li>
                        <li>6</li>
                        </ul>
                        <!--按钮控制器-->
                        <span class="btnleft"></span>
                        <span class="btnright"></span>
                    </div>
                    <!-- 轮播图结束 -->
                <div><img src="./imgs/index11_08.jpg" alt=""></div>
            </div>
            <!-- 右边 -->
            <div class="clothing_right fl">
                <ul class="fl clearfix">
                    <li>
                        <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                        <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                        <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                        <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                    </li>
                </ul>
            </div>
            
        </div>
        <div class="clothing_ clearfix fl">
            <!-- 左边部分 -->
            <div class="clothing_left fl">
                <img src="./imgs/精品鞋靴/52610014590238_1_o.jpg" alt="">
                <table>
                    <tr>
                        <td>中小学教辅</td>
                        <td>外语</td>
                        <td>考试</td>
                    </tr>
                    <tr>
                        <td>小说</td>
                        <td>文学</td>
                        <td>青春文学</td>
                    </tr>
                    <tr>
                        <td>成功\励志</td>
                        <td>管理</td>
                        <td>历史</td>
                    </tr>
                    <tr>
                        <td>哲学\宗教</td>
                        <td>亲子\家教</td>
                        <td>全部分类></td>
                    </tr>
                </table>
            </div>
            <!-- 中间部分 -->
            <div class="clothing_mid fl">
                    <!-- 右边轮播图开始 -->
                    <div class="pptbox" id="clothing_mid_left">
                        <!--轮播的内容-->
                        <ul class="innerwrapper">
                        <li>
                            <img src="imgs/banner1.jpg" />
                        </li>
                        <li>
                            <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner3.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner4.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner5.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner2.jpg"></a>
                        </li>
                        </ul>
                        <!--数字控制器-->
                        <ul class="controls">
                        <li class="current">1</li>
                        <li>2</li>
                        <li>3</li>
                        <li>4</li>
                        <li>5</li>
                        <li>6</li>
                        </ul>
                        <!--按钮控制器-->
                        <span class="btnleft"></span>
                        <span class="btnright"></span>
                    </div>
                    <!-- 轮播图结束 -->
                <div><img src="./imgs/index11_08.jpg" alt=""></div>
            </div>
            <!-- 右边 -->
            <div class="clothing_right fl">
                <ul class="fl clearfix">
                    <li>
                        <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                        <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                        <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                        <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                    </li>
                </ul>
            </div>
            
        </div>
    </div>
    <!-- 运动产品区域结束 -->

    <!-- 婴儿用品区域开始 -->
    <div class="clothing clearfix warpper fooer">
        <h3 class="fl">服装
            <div class="fr clearfix">
                <span class="active">女装内衣</span>
                <span>热销男装</span>
                <span>精品鞋靴</span>
            </div>
        </h3>
        <div class="clothing_ clothing_show clearfix fl">
            <!-- 左边部分 -->
            <div class="clothing_left fl">
                <img src="./imgs/index7_17.jpg" alt="">
                <table>
                    <tr>
                        <td>中小学教辅</td>
                        <td>外语</td>
                        <td>考试</td>
                    </tr>
                    <tr>
                        <td>小说</td>
                        <td>文学</td>
                        <td>青春文学</td>
                    </tr>
                    <tr>
                        <td>成功\励志</td>
                        <td>管理</td>
                        <td>历史</td>
                    </tr>
                    <tr>
                        <td>哲学\宗教</td>
                        <td>亲子\家教</td>
                        <td>全部分类></td>
                    </tr>
                </table>
            </div>
            <!-- 中间部分 -->
            <div class="clothing_mid fl">
                    <!-- 右边轮播图开始 -->
                    <div class="pptbox" id="clothing_mid_left">
                        <!--轮播的内容-->
                        <ul class="innerwrapper">
                        <li>
                            <img src="imgs/banner1.jpg" />
                        </li>
                        <li>
                            <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner3.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner4.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner5.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner2.jpg"></a>
                        </li>
                        </ul>
                        <!--数字控制器-->
                        <ul class="controls">
                        <li class="current">1</li>
                        <li>2</li>
                        <li>3</li>
                        <li>4</li>
                        <li>5</li>
                        <li>6</li>
                        </ul>
                        <!--按钮控制器-->
                        <span class="btnleft"></span>
                        <span class="btnright"></span>
                    </div>
                    <!-- 轮播图结束 -->
                <div><img src="./imgs/index11_08.jpg" alt=""></div>
            </div>
            <!-- 右边 -->
            <div class="clothing_right fl">
                <ul class="fl clearfix">
                    <li>
                        <img src="./imgs/index100_05.jpg" alt="">
                        <div><img src="./imgs/index100_11.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/index100_05.jpg" alt="">
                        <div><img src="./imgs/index100_11.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/index100_05.jpg" alt="">
                        <div><img src="./imgs/index100_11.jpg" alt=""></div>
                    </li>
                </ul>
            </div>
            
        </div>
        <div class="clothing_ clearfix fl">
            <!-- 左边部分 -->
            <div class="clothing_left fl">
                <img src="./imgs/女装内衣/106960016344413_y.jpg" alt="">
                <table>
                    <tr>
                        <td>中小学教辅</td>
                        <td>外语</td>
                        <td>考试</td>
                    </tr>
                    <tr>
                        <td>小说</td>
                        <td>文学</td>
                        <td>青春文学</td>
                    </tr>
                    <tr>
                        <td>成功\励志</td>
                        <td>管理</td>
                        <td>历史</td>
                    </tr>
                    <tr>
                        <td>哲学\宗教</td>
                        <td>亲子\家教</td>
                        <td>全部分类></td>
                    </tr>
                </table>
            </div>
            <!-- 中间部分 -->
            <div class="clothing_mid fl">
                    <!-- 右边轮播图开始 -->
                    <div class="pptbox" id="clothing_mid_left">
                        <!--轮播的内容-->
                        <ul class="innerwrapper">
                        <li>
                            <img src="imgs/banner1.jpg" />
                        </li>
                        <li>
                            <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner3.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner4.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner5.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner2.jpg"></a>
                        </li>
                        </ul>
                        <!--数字控制器-->
                        <ul class="controls">
                        <li class="current">1</li>
                        <li>2</li>
                        <li>3</li>
                        <li>4</li>
                        <li>5</li>
                        <li>6</li>
                        </ul>
                        <!--按钮控制器-->
                        <span class="btnleft"></span>
                        <span class="btnright"></span>
                    </div>
                    <!-- 轮播图结束 -->
                <div><img src="./imgs/index11_08.jpg" alt=""></div>
            </div>
            <!-- 右边 -->
            <div class="clothing_right fl">
                <ul class="fl clearfix">
                    <li>
                        <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                        <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                        <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/热销男装/136700019847353_1_o.jpg" alt="">
                        <div><img src="./imgs/热销男装/D.jpg" alt=""></div>
                    </li>
                </ul>
            </div>
            
        </div>
        <div class="clothing_ clearfix fl">
            <!-- 左边部分 -->
            <div class="clothing_left fl">
                <img src="./imgs/精品鞋靴/52610014590238_1_o.jpg" alt="">
                <table>
                    <tr>
                        <td>中小学教辅</td>
                        <td>外语</td>
                        <td>考试</td>
                    </tr>
                    <tr>
                        <td>小说</td>
                        <td>文学</td>
                        <td>青春文学</td>
                    </tr>
                    <tr>
                        <td>成功\励志</td>
                        <td>管理</td>
                        <td>历史</td>
                    </tr>
                    <tr>
                        <td>哲学\宗教</td>
                        <td>亲子\家教</td>
                        <td>全部分类></td>
                    </tr>
                </table>
            </div>
            <!-- 中间部分 -->
            <div class="clothing_mid fl">
                    <!-- 右边轮播图开始 -->
                    <div class="pptbox" id="clothing_mid_left">
                        <!--轮播的内容-->
                        <ul class="innerwrapper">
                        <li>
                            <img src="imgs/banner1.jpg" />
                        </li>
                        <li>
                            <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner3.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner4.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner5.jpg" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="imgs/banner2.jpg"></a>
                        </li>
                        </ul>
                        <!--数字控制器-->
                        <ul class="controls">
                        <li class="current">1</li>
                        <li>2</li>
                        <li>3</li>
                        <li>4</li>
                        <li>5</li>
                        <li>6</li>
                        </ul>
                        <!--按钮控制器-->
                        <span class="btnleft"></span>
                        <span class="btnright"></span>
                    </div>
                    <!-- 轮播图结束 -->
                <div><img src="./imgs/index11_08.jpg" alt=""></div>
            </div>
            <!-- 右边 -->
            <div class="clothing_right fl">
                <ul class="fl clearfix">
                    <li>
                        <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                        <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                        <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                    </li>
                    <li>
                        <img src="./imgs/精品鞋靴/160729-11181pc-C.jpg" alt="">
                        <div><img src="./imgs/精品鞋靴/160729-13433pc-D.jpg" alt=""></div>
                    </li>
                </ul>
            </div>
            
        </div>
    </div>
    <!-- 婴儿用品区域结束 -->

    <!-- 家居日常区域开始 -->
    <div class="home warpper clearfix fooer">
        <h3>家居日用</h3>
        <!-- 左边 -->
        <div class="home_left fl">
            <!-- 轮播图开始 -->
            <div class="pptbox" id="bannerInner">
                <!--轮播的内容-->
                <ul class="innerwrapper">
                <li>
                    <img src="imgs/index21_05.jpg" />
                </li>
                <li>
                    <a href="#"></a><img src="imgs/banner2.jpg" /></a>
                </li>
                <li>
                    <a href="#"><img src="imgs/banner3.jpg" /></a>
                </li>
                <li>
                    <a href="#"><img src="imgs/banner4.jpg" /></a>
                </li>
                <li>
                    <a href="#"><img src="imgs/banner5.jpg" /></a>
                </li>
                </ul>
                <!--数字控制器-->
                <ul class="controls">
                <li class="current">1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
                <li>5</li>
                
                </ul>
                <!--按钮控制器-->
                <span class="btnleft"></span>
                <span class="btnright"></span>
            </div>
            <!-- 轮播图结束 -->
        </div>
        <!-- 右边 -->
        <ul class="clearfix fl">
            <li>
                <img src="./imgs/index22_05.jpg" alt="">
                <div>
                    <img src="./imgs/index23_08.jpg" alt="">
                </div>
            </li>
            <li>
                <img src="./imgs/index22_05.jpg" alt="">
                <div>
                    <img src="./imgs/index23_08.jpg" alt="">
                </div>
            </li>
            <li>
                <img src="./imgs/index22_05.jpg" alt="">
                <div>
                    <img src="./imgs/index23_08.jpg" alt="">
                </div>
            </li>
            <li>
                <img src="./imgs/index22_05.jpg" alt="">
                <div>
                    <img src="./imgs/index23_08.jpg" alt="">
                </div>
            </li>
        </ul>
    </div>
    <!-- 家居日常区域结束 -->

    <!-- 推广区域开始 -->
    <div class="extend warpper">
        <h3 class="clearfix">
            推广商品
            <span class="fr">
                <i></i>
                <i></i>
            </span>
        </h3>
        <ul class="clearfix">
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
            <li>
                <img src="./imgs/index25_12.jpg" alt="">
                <p class="p1">Pigeon法国制奶嘴，无
                    毒天然乳胶</p>
                <p class="p2">￥:189</p>
                <p class="p3">
                    <i></i>
                    <span>
                        已有<span>988</span> 条评价
                    </span>
                </p>
            </li>
        </ul>
        <i></i>
    </div>
    <!-- 推广区域结束 -->

    <!-- 页脚区域开始 -->
    <div class="footer">
        <div class="footer_top">
            <ul class="warpper clearfix">
                <li>
                    <img src="./imgs/222_11.png" alt="">
                </li>
                <li>
                    <img src="./imgs/222_13.png" alt="">
                </li>
                <li>
                    <img src="./imgs/222_15.png" alt="">
                </li>
                <li>
                    <img src="./imgs/222_17.png" alt="">
                </li>
            </ul>
        </div>
        <div class="footer_mid warpper clearfix">
            <ul class="ul1">
                <li>购物指南</li>
                <li>购物流程</li>
                <li>发票制度</li>
                <li>账户管理</li>
                <li>会员优惠</li>
            </ul>
            <ul>
                <li>支付方式</li>
                <li>货到付款</li>
                <li>网上支付</li>
                <li>礼品卡支付</li>
                <li>银行转帐</li>
            </ul>
            <ul>
                <li>订单服务</li>
                <li>订单配送查询</li>
                <li>订单状态说明</li>
                <li>自助取消订单</li>
                <li>自助修改订单</li>
            </ul>
            <ul>
                <li>退换货</li>
                <li>退换货政策</li>
                <li>自助申请退换货</li>
                <li>退换货进度查询</li>
                <li>退款方式和时间</li>
            </ul>
            <ul>
                <li>商家服务</li>
                <li>商家中心</li>
                <li>运营服务</li>
                <li>加入尾品汇</li>
            </ul>
            <img src="./imgs/logo_00.png" alt="">
        </div>
        <div class="footer_bom warpper">
            <p>
                公司简介 &emsp; | &emsp; Investor Relations  &emsp;| &emsp; 网站联盟  &emsp;|&emsp;  乐购招商  &emsp;|&emsp;  机构销售  &emsp;|&emsp;  手机乐购  &emsp;|&emsp;  官方Blog   &emsp;|&emsp;  热词搜索
            </p>
            <p>
                Copyright (C) 乐购网 2004-2016, All Rights Reserved
            </p>
        </div>
    </div>
    <!-- 页脚区域结束 -->

    <!-- 固定头部功能 -->
    <div class="fixedHeader b_b">
        <script>
            $(".header .search").clone().appendTo(".fixedHeader")
        </script>
    </div>

    <!-- 侧边栏 -->
    <div class="cbl">
        <div class="div1"></div>
        <div class="div2">
            领券中心
            <img src="./imgs/two_34.jpg" alt="">
        </div>
        <div class="div3"></div>
    </div>
    <script>
        $(".cbl .div2").mouseenter(function(){
            $(this).find("img").stop().animate({left:-100},1000)
        })
        $(".cbl .div2").mouseleave(function(){
            $(this).find("img").stop().animate({left:40},1000)
        })
    </script>
</body>
</html>